<template>
  <div>
    <tableComponents
      :pagination="{ currentPage, pageSize, total: list.all_num }"
      @handleCurrentChange="handleCurrentChange"
      @handleSizeChange="handleSizeChange"
      @sendUserSearch="getOrderSearch"
      :searchData="userSearchData"
      :isHaveExport="false"
      :isHaveAdd="false"
    >
      <template v-slot:table>
        <div v-for="(vo, i) in list.data" :key="i" v-show="list.data">
          <el-row :gutter="1">
            <el-col :span="24" class="tl">
              <div class="grid-content bg-purple-light">
                <span class="gray-font gray_set">
                  &nbsp;&nbsp;{{ vo.created_time | getTimeFormat }}
                  &nbsp;&nbsp;订单号：
                </span>
                <!-- {{list.all_num}} -->
                {{ vo.oid }}
                <span
                  class="gray-font gray_set"
                  v-if="vo.sid != 0"
                  @click="toSupplierDetila(vo.sid)"
                  >&nbsp;&nbsp;&nbsp;&nbsp;商家：{{ vo.sid_cn }}</span
                >
                <span class="gray-font gray_set" v-if="vo.sid == 0"
                  >&nbsp;&nbsp;&nbsp;&nbsp;自营</span
                >
                <span class="gray-font gray_set" v-if="vo.fid_cn"
                  >&nbsp;&nbsp;&nbsp;&nbsp;{{ vo.fid_cn }}</span
                >
                <span style="padding-left: 20px"
                  >订单类型：{{ vo.types_cn }}</span
                >

                <span
                  class="gray-font gray_set"
                  style="float: right"
                  @click="getPrintTemplate(vo)"
                  v-if="vo.print_template"
                >
                  电子面单 &nbsp; &nbsp;&nbsp;&nbsp;
                </span>
                <span
                  class="gray-font gray_set"
                  style="float: right"
                  v-if="vo.status != '未支付'"
                  @click="getPrintreceipt(vo)"
                >
                  小票 &nbsp; &nbsp;&nbsp;&nbsp;
                </span>
                <span
                  class="gray-font gray_set"
                  style="float: right"
                  @click="getPrintInfo(vo)"
                >
                  打印 &nbsp; &nbsp;&nbsp;&nbsp;
                </span>
                <span
                  class="gray-font gray_set"
                  style="float: right"
                  @click="showRewardDialog(i, vo.oid)"
                >
                  奖金审核 &nbsp; &nbsp;&nbsp;&nbsp;
                </span>
                <span
                  class="gray-font gray_set"
                  style="float: right"
                  v-if="vo.mail_oid && vo.mail_oid != ''"
                  @click="open_mail(vo)"
                >
                  查看物流 &nbsp; &nbsp;&nbsp;&nbsp;
                </span>
              </div>
            </el-col>
          </el-row>

          <el-row :gutter="1">
            <div class="order_list">
              <table class="big_table">
                <tr>
                  <td class="li_1 big_table_td tl" style="padding: 0px">
                    <table class="small_table tl">
                      <tr v-for="(po, j) in vo.product" :key="j">
                        <td>
                          <router-link
                            :to="'/index/shop/addproduct?id=' + po.pid"
                            target="_blank"
                          >
                            <div class="table_img">
                              <img :src="imgError(po.piclink)" class="image" />
                            </div>
                          </router-link>
                        </td>
                        <td :title="po.title" style="flex: 23">
                          <router-link
                            :to="'/index/shop/addproduct?id=' + po.pid"
                            target="_blank"
                          >
                            {{ po.title }}
                            <span>{{ po.sku_cn }}</span>
                            <br />
                          </router-link>
                          <router-link
                            :to="{ name: 'returned', query: { oid: po.oid } }"
                            target="_blank"
                          >
                            <el-tag
                              v-if="po.order_return"
                              size="mini"
                              type="danger"
                              effect="dark"
                              >{{ po.order_return }}</el-tag
                            >
                          </router-link>
                        </td>

                        <td>
                          <span class="gray-font">x{{ po.number }}</span>
                        </td>
                        <td>价格：￥{{ po.money | keepTwoNum }}</td>
                      </tr>
                    </table>
                  </td>

                  <td class="li_2 big_table_td">
                    <div class="uname">
                      <span @click="went_user(vo.uid)">{{ vo.uid_cn }}</span>
                      <br />
                      <span @click="went_user(vo.uid)">{{ vo.uid_nick }}</span>
                      <br />
                      <span @click="went_user(vo.tid)"
                        >推广员：{{ vo.tid > 0 ? vo.tid_cn : "" }}</span
                      >
                    </div>
                  </td>

                  <td class="li_3 big_table_td">
                    <span class="gray-font">
                      总价 ¥{{ vo.sum_price | keepTwoNum }}
                      <br />
                      实付 ¥{{ vo.money | keepTwoNum }}
                      <span class="pay_info">{{ vo.pay || "未支付" }}</span>
                      <span v-if="vo.pay"
                        >付款时间：{{ vo.pay_time | getTimeFormat }}</span
                      >
                    </span>
                  </td>

                  <td class="li_4 big_table_td">
                    <div>{{ toStatus(vo.yuncang_status) }}</div>
                    <div>操作时间：{{ vo.yuncang_time | getTimeFormat }}</div>
                    <div v-if="vo.yuncang_cn">
                      发货人：{{ vo.yuncang_nick || "xxx" }}（{{
                        vo.yuncang_cn
                      }}）
                    </div>
                    <div>申诉理由：{{ vo.yuncang_representation_reason }}</div>
                  </td>
                  <td class="li_5 big_table_td">
                    <div v-if="searchAll.yuncang_status < 3">
                      <el-button
                        :loading="$store.state.isLoading"
                        type="primary"
                        size="mini"
                        @click="comfirmPay1(vo.id)"
                        >取消订单</el-button
                      >
                    </div>
                    <br />
                    <el-button
                      :loading="$store.state.isLoading"
                      type="success"
                      size="mini"
                      @click="comfirmPay(vo.id)"
                      >确认完成</el-button
                    >
                  </td>
                </tr>
              </table>
            </div>
          </el-row>
        </div>
        <div
          v-show="list.data == ''"
          class="bg_write"
          style="height: 60px; line-height: 40px; color: #999"
        >
          暂无数据
          <br />
        </div>
      </template>
      <template v-slot:searchBottom>
        <el-form class="search_prod search_prod1" label-width="94px">
          <el-form-item label="订单类型">
            <el-row class="tl mar_bottom_15">
              <el-radio-group
                v-model="acIndex"
                size="small"
                class="tl money-group"
              >
                <el-radio-button
                  v-for="(item, i) in prodType"
                  :label="item.iden"
                  v-show="!item.show"
                  :key="i"
                  >{{ item.title }}</el-radio-button
                >
              </el-radio-group>
            </el-row>
          </el-form-item>
        </el-form>
      </template>
    </tableComponents>

    <el-dialog
      :close-on-click-modal="false"
      title="发货"
      :visible.sync="dialogTableVisible"
    >
      <el-form :model="form" class="mar_top" label-width="100px">
        <el-form-item label="订单号">
          <el-col :span="4">
            <el-input
              :disabled="true"
              placeholder
              v-model="form.oid"
              style="width: 400px"
              clearable
            ></el-input>
          </el-col>
        </el-form-item>
        <el-form-item label="下单会员">
          <el-col :span="4">
            <el-input
              :disabled="true"
              placeholder
              v-model="form.uid_cn"
              style="width: 400px"
              clearable
            ></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="金额">
          <el-col :span="4">
            <el-input
              :disabled="true"
              placeholder
              :value="$fnc.toFixedZ(form.money)"
              style="width: 400px"
              clearable
            ></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="收货地址">
          <el-col :span="4">
            <el-input
              :disabled="true"
              placeholder
              :value="
                $fnc.deleteNumber(
                  form.mail_province +
                    form.mail_city +
                    form.mail_area +
                    form.mail_town
                ) + form.mail_address
              "
              style="width: 400px"
              clearable
            ></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="收货人">
          <el-col :span="4">
            <el-input
              :disabled="true"
              placeholder
              v-model="form.mail_name"
              style="width: 400px"
              clearable
            ></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="联系电话">
          <el-col :span="4">
            <el-input
              :disabled="true"
              placeholder
              v-model="form.mail_tel"
              style="width: 400px"
              clearable
            ></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="发货方式" v-if="isOpenKdn && isMailOpen">
          <el-col :span="20" class="tl">
            <el-radio v-model="form.mail_type" label="0">常规发货</el-radio>
            <el-radio
              v-model="form.mail_type"
              v-if="isOpenKdn && isMailOpen"
              label="1"
              >快递鸟电子面单</el-radio
            >
          </el-col>
        </el-form-item>

        <el-form-item
          label="快递鸟面单号"
          v-if="form.mail_type == 1 && isOpenKdn && isMailOpen"
        >
          <el-col :span="4">
            <el-input
              :disabled="true"
              placeholder
              v-model="form.kdn_order_code"
              style="width: 400px"
              clearable
            ></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="物流单号">
          <el-col :span="4">
            <el-input
              v-if="form.mail_type == 1 && isOpenKdn && isMailOpen"
              :disabled="true"
              placeholder
              v-model="form.mail_oid"
              style="width: 400px"
              clearable
            ></el-input>

            <el-input
              v-else
              placeholder
              v-model="form.mail_oid"
              style="width: 400px"
              clearable
            ></el-input>
          </el-col>
        </el-form-item>

        <el-form-item label="物流公司" v-if="form.mail_type == 0">
          <el-col :span="8">
            <el-select
              v-model="form.mail_courier"
              placeholder="请选择"
              @change="mail_change"
            >
              <el-option
                v-for="item in company"
                :key="item.id"
                clearable
                :label="item.title"
                :value="item"
              ></el-option>
            </el-select>
            <!-- <el-input placeholder
                            :disabled="true"
                            v-model="form.mail_courier"
                            style="width:400px"
            clearable></el-input>-->
          </el-col>
        </el-form-item>

        <el-form-item label="发货时间">
          <el-col :span="4">
            <el-date-picker
              v-if="form.mail_type == 1"
              :disabled="true"
              v-model="form.mail_time"
              type="datetime"
              value-format="timestamp"
              placeholder="选择日期"
            ></el-date-picker>
            <el-date-picker
              v-else
              v-model="form.mail_time"
              type="datetime"
              value-format="timestamp"
              placeholder="选择日期"
            ></el-date-picker>
          </el-col>
        </el-form-item>

        <el-form-item label="管理员备注">
          <el-col :span="4">
            <el-input
              type="textarea"
              placeholder
              v-model="form.remark"
              style="width: 400px"
              clearable
            ></el-input>
          </el-col>
        </el-form-item>

        <div class="mar_bottom_15">
          <el-button
            :loading="$store.state.isLoading"
            size="medium"
            type="primary"
            @click.prevent="subForm()"
            >确定</el-button
          >
        </div>
      </el-form>
    </el-dialog>

    <el-dialog
      :close-on-click-modal="false"
      title="奖金审核"
      :visible.sync="dialogRewardVisible"
      class="tl size_13"
      width="1200px"
    >
      <el-table
        ref="multipleTable"
        :data="moneylist"
        border
        tooltip-effect="dark"
        style="width: 100%"
      >
        <el-table-column label="会员账号" min-width="50">
          <template slot-scope="scope">{{ scope.row.username }}</template>
        </el-table-column>

        <el-table-column label="会员昵称" min-width="50">
          <template slot-scope="scope">{{ scope.row.nickname }}</template>
        </el-table-column>

        <el-table-column label="订单号" min-width="50">
          <template slot-scope="scope">{{ scope.row.oid }}</template>
        </el-table-column>

        <el-table-column label="积分/现金" min-width="50">
          <template slot-scope="scope">
            {{ $fnc.toFixedZ(scope.row.money, 3) }}
            {{ scope.row.style_cn }}
          </template>
        </el-table-column>

        <el-table-column label="时间" min-width="50">
          <template slot-scope="scope">{{
            scope.row.created_time | getTimeFormat
          }}</template>
        </el-table-column>

        <el-table-column label="剩余积分/现金" min-width="50">
          <template slot-scope="scope">
            {{ $fnc.toFixedZ(scope.row.balance, 3) }}
            {{ scope.row.style_cn }}
          </template>
        </el-table-column>

        <el-table-column label="交易类型" min-width="50">
          <template slot-scope="scope">{{ scope.row.style }}</template>
        </el-table-column>
      </el-table>
    </el-dialog>

    <el-dialog
      :close-on-click-modal="false"
      title="物流详情"
      :lock-scroll="true"
      :visible.sync="mail_show"
      class="tl size_13"
      width="1000px"
    >
      <div v-if="mail_form && mail_form.Traces" class="mail_box">
        <h1 style="padding: 20px 0">
          {{ mail_form.mail_courier }}
          【物流单号：{{ mail_form.LogisticCode }}】
          <el-tag
            type="danger"
            @click="copy_btn(mail_form.LogisticCode)"
            effect="dark"
            >复制</el-tag
          >
        </h1>
        <el-timeline>
          <el-timeline-item
            v-for="(activity, index) in mail_form.Traces"
            :key="index"
            :timestamp="activity.AcceptTime"
            >{{ activity.AcceptStation }}</el-timeline-item
          >
        </el-timeline>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import { mapState } from "vuex";
import { ycOrderSearchData } from "@/assets/js/searchData/searchData"; //引入搜索的数据
export default {
  data() {
    return {
      userSearchData: ycOrderSearchData,
      mail_form: {},
      mail_show: false,
      sel_mail: {},
      company: [],
      dialogTableVisible: false,
      dialogRewardVisible: false,
      dialogPrintVisible: false,
      show: false,
      myshow: false,
      loading: false,
      list: [],
      allPage: 0,
      allNum: 0,
      pageSize: 10,
      currentPage: 1,
      editId: "",
      multipleSelection: "",
      arr: [],
      visible: false,
      clickNum: 1,
      updataIndex: "",
      form: {
        id: "",
        oid: "",
        mail_oid: "",
        mail_time: "",
        remark: "",
        kdn_order_code: "",
        mail_type: "0",
        mail_courier: "",
        mail_courier_en: "",
        yuncang_status: "0",
        yuncang_representation: "1",
      },
      moneylist: [],
      val: "",
      index: "",
      vo: "",
      searchAll: {
        yuncang_status: this.$route.query.status || "0",
        oid: this.$route.query.oid || "",
        yuncang_representation: "1",
      },
      iskdlwnjk: false,
      acIndex: "0",
    };
  },

  methods: {
    getInfo(iddex) {
      this.acIndex = iddex;
      this.searchAll.yuncang_status = iddex;
      this.getStatus(this.searchAll.yuncang_status);
    },
    toStatus(status) {
      var str;
      switch (status) {
        case "0":
          str = "未确认";

          break;
        case "1":
          str = "待付款";

          break;
        case "2":
          str = "待收款";

          break;
        case "3":
          str = "已完成";

          break;
        case "4":
          str = "取消订单";

          break;
        default:
          str = "";
      }
      return str;
    },
    getPrintreceipt(vo) {
      // this.$router.push({ path: "/printorder", query: { id: vo.id } });
      let routeData = this.$router.resolve({
        path: "/printreceipt",
        query: { id: vo.id },
      });
      window.open(routeData.href, "_blank");
    },
    copy_btn(str) {
      var oInput = document.createElement("input");
      oInput.value = str;
      document.body.appendChild(oInput);
      oInput.select();
      document.execCommand("Copy");
      oInput.className = "oInput";
      oInput.style.display = "none";
      this.$message({
        showClose: true,
        message: "复制成功",
        type: "success",
      });
    },
    open_mail(item) {
      this.mail_show = true;
      this.$api.getShops.get_mail({ id: item.id }).then((res) => {
        if (res.data.code == 200) {
          this.mail_form = res.data.result.mail;
          this.mail_form.mail_courier = res.data.result.mail_courier;
        }
      });
    },
    mail_change(value) {
      this.form.mail_courier = value.title;
      this.form.mail_courier_en = value.title_en;
    },
    comfirmPay(id) {
      var taht = this;
      this.$confirm("是否确认完成?", "确认", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          taht.$api.getYc.confimOrderCollection({ id }).then((res) => {
            if (res.data.code === 200) {
              taht.reload();
              taht.$message({
                type: "success",
                message: "确认成功!",
              });
            } else {
              this.$fnc.alertError(res.data.result);
            }
          });
        })
        .catch(() => {
          taht.$message({
            type: "info",
            message: "已取消",
          });
        });
    },
    comfirmPay1(id) {
      var taht = this;
      this.$confirm("是否确认取消订单?", "确认", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          taht.$api.getYc.confimOrderCancel({ id }).then((res) => {
            if (res.data.code === 200) {
              taht.reload();
              taht.$message({
                type: "success",
                message: "确认成功!",
              });
            } else {
              this.$fnc.alertError(res.data.result);
            }
          });
        })
        .catch(() => {
          taht.$message({
            type: "info",
            message: "已取消",
          });
        });
    },
    copy_tjm($event) {
      var dom = $event.currentTarget.parentElement.previousElementSibling;
      var span = dom.innerText;
      var oInput = document.createElement("input");
      oInput.value = span;
      document.body.appendChild(oInput);
      oInput.select();
      document.execCommand("Copy");
      oInput.className = "oInput";
      oInput.style.display = "none";
      this.$fnc.alertSuccess("复制成功");
    },
    went_user(tid) {
      let routeData = this.$router.resolve({
        path: "/index/user/user_info",
        query: { id: tid },
      });
      window.open(routeData.href, "_blank");
    },
    getOrderSearch(obj) {
      this.searchAll = obj;
      this.$router.push(this.$route.path + "?page=" + 1);
      this.getNewsAll(obj);
    },
    getStatus(sta) {
      this.searchAll.yuncang_status = sta;
      this.$router.push(this.$route.path + "?page=" + 1);
      this.getNewsAll({ yuncang_status: sta });
    },
    check_kdn() {
      var data = { sid: this.vo.sid };

      this.$api.getUser.checkKdn(data).then((res) => {
        if (res.data.code != 200) {
          this.$fnc.alertError("请先到设置中配置快递鸟接口");
          this.form.mail_type = "0";
          if (this.vo) {
            this.vo.mail_type = "0";
          }

          return false;
        }
      });
    },
    imgError(item) {
      if (!item) {
        return require("../../../assets/img/default_head.png");
      }
      if (item.indexOf("http") >= 0 || item.indexOf("api") >= 0) {
        return item;
      } else {
        return "/api/" + item;
      }
    },
    toSupplierDetila(id) {
      let routeData = this.$router.resolve({
        path: "/index/user/user_info",
        query: { id: id },
      });
      window.open(routeData.href, "_blank");
    },
    getOrderInfo(vo) {
      // this.$router.push({
      //   path: "/index/order/addorder",
      //   query: { id: vo.id }
      // });
      let routeData = this.$router.resolve({
        path: "/index/order/addorder",
        query: { id: vo.id },
      });
      window.open(routeData.href, "_blank");
    },

    getPrintInfo(vo) {
      // this.$router.push({ path: "/printorder", query: { id: vo.id } });
      let routeData = this.$router.resolve({
        path: "/printorder",
        query: { id: vo.id },
      });
      window.open(routeData.href, "_blank");
    },
    getPrintTemplate(vo) {
      let routeData = this.$router.resolve({
        path: "/printtemplate",
        query: { id: vo.id },
      });
      window.open(routeData.href, "_blank");
    },
    getNewsAll(data) {
      this.loading = true;
      data = data || {};
      var params = {};
      params = data;
      params.yuncang_representation = "1";
      this.$api.getYc.getOrderList(params).then((res) => {
        if (res.data.code == 200 && res.data.status == 1) {
          this.list = res.data.result;
        } else {
          this.$fnc.alertError(res.data.code_desc, res.data.result);
        }
        this.loading = false;
      });
    },
    handleSizeChange(val) {
      this.getNewsAll("", val);
      var params = this.searchAll;
      params.page = "";
      params.page_size = val;
      this.getNewsAll(params);
      this.pageSize = val;
      // console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      this.$router.push(this.$route.path + "?page=" + val);
    },
    handleSwitch(val, id) {
      //审核
      var params = {};
      params["id"] = id;
      val == true ? (params["is_check"] = 1) : (params["is_check"] = 0);
      this.$api.getUser.msgCheck(params).then((res) => {
        // this.getNewsAll();
      });
    },
    handleSelectionChange(val) {
      //多选框赋值
      this.multipleSelection = val;
    },
    showEditDialog(index, vo) {
      var mail_courier = this.form.mail_courier;
      var mail_courier_en = this.form.mail_courier_en;
      this.index = index;
      this.form = vo;
      this.form.mail_time = this.$fnc.vuetime(vo.mail_time);

      if (!this.isMailOpen || !this.isOpenKdn) {
        this.form.mail_type = 0;
      }

      if (
        vo.mail_courier == "" ||
        vo.mail_courier == null ||
        vo.mail_courier == undefined
      ) {
        this.form.mail_courier = mail_courier;
        this.form.mail_courier_en = mail_courier_en;
      }
      this.dialogTableVisible = true;
      this.clickNum++;
    },
    showRewardDialog(index, oid) {
      this.dialogRewardVisible = true;
      var data = {};
      data["oid"] = oid;
      this.$api.getUser.orderMoneyList(data).then((res) => {
        if (res.data.status == 1 && res.data.code == 200) {
          this.moneylist = res.data.result;
        } else {
          this.$fnc.alertError(res.data.code_desc, res.data.result);
        }
      });
    },
    reload(id) {
      var params = this.searchAll;
      params.page = this.$route.query.page || 1;
      params.page_size = this.pageSize;
      this.getNewsAll(params);
      this.currentPage = Number(this.$route.query.page) || 1;
    },
    subForm() {
      var data = {};
      data["id"] = this.form.id;

      data["mail_courier"] = this.form.mail_courier;
      data["mail_courier_en"] = this.form.mail_courier_en;
      data["mail_oid"] = this.form.mail_oid;

      var str = this.form.mail_time;
      str = str.toString();
      var s1 = str.substring(0, str.length - 3);

      data["mail_time"] = s1;
      data["remark"] = this.form.remark;

      data["mail_type"] = this.form.mail_type;
      this.$api.getUser.orderMailSave(data).then((res) => {
        this.dialogTableVisible = false;

        if (res.data.status == 1 && res.data.code == 200) {
          this.form.kdn_order_code = res.data.result.kdn_order_code;
          this.form.mail_oid = res.data.result.mail_oid;
          this.$fnc.alertSuccess({ text: "添加成功" });
          this.getPage();

          this.visible = false;
        } else {
          this.$fnc.alertError(res.data.code_desc, res.data.result);
        }
      });
    },
    getPage() {
      var params = this.searchAll;
      params.page = this.$route.query.page || 1;
      params.page_size = this.pageSize;
      this.getNewsAll(params);
      this.currentPage = Number(this.$route.query.page) || 1;
    },
    setReserve(index, vo) {
      var data = {};
      data["id"] = vo.id;
      this.$api.getUser.orderServeSave(data).then((res) => {
        if (res.data.status == 1 && res.data.code == 200) {
          this.$fnc.alertSuccess({ text: "开始服务成功" });
          this.getPage();
        } else {
          this.$fnc.alertError(res.data.code_desc, res.data.result);
        }
      });
    },
  },
  created() {
    this.getNewsAll(this.searchAll);
    this.$api.getSupplier.get_mail_company({}).then((res) => {
      if (res.data.code == 200) {
        this.company = res.data.result;
        console.log(this.company);
        if (res.data.result != undefined && res.data.result.length > 0) {
          this.form.mail_courier = this.company[0].title;
          this.form.mail_courier_en = this.company[0].title_en;
        }
      }
    });
  },
  mounted() {
    var kdlwnjk =
      JSON.parse(localStorage.getItem("limit")).kdlwnjk &&
      JSON.parse(localStorage.getItem("limit")).kdlwnjk.is_open
        ? JSON.parse(localStorage.getItem("limit")).kdlwnjk.is_open
        : 0 || 0;
    kdlwnjk == 1 ? (this.iskdlwnjk = true) : (this.iskdlwnjk = false);
  },
  computed: {
    ...mapState({
      plugin: (state) => state.plugin,
      isMailOpen: (state) => state.isMailOpen,
    }),
    isOpenKdn() {
      if (this.plugin.kdlwnjk && this.plugin.kdlwnjk.is_open == 1) {
        return true;
      } else {
        return false;
      }
    },
    mailType() {
      return this.form.mail_type;
    },
    prodType() {
      return [
        { iden: "0", title: "未确认" },
        { iden: "1", title: "待付款" },
        { iden: "2", title: "待收款" },
        { iden: "3", title: "已完成" },
        { iden: "4", title: "取消订单" },
      ];
    },
  },
  watch: {
    $route() {
      this.getPage();
    },
    acIndex(val) {
      this.getInfo(val);
    },
  },
};
</script>

<style lang="less" scoped>
.el-col {
  border-radius: 4px;
}
.image {
  /*border: 1px solid #efefef;*/
  /*width: 60px;*/
  /*height: 60px;*/
  /*margin: 0 14px;*/
}
.bg-purple {
  background: #ffffff;
}
.bg-purple-light {
  background: #f5f5f5;
}
.grid-content {
  background: #f5f5f5;
  height: 31px;
  line-height: 31px;
  font-size: 12px;
  color: #aaa;
  overflow: hidden;
  border: 1px solid #e5e5e5;
}
.grid-content2 {
  float: left;
  font-size: 14px;
  min-height: 100px;
}
.order_num {
  color: #333;
}
.line-balck {
  border-right: 1px solid #e5e9f2;
  border-bottom: 1px solid #e5e9f2;
}
.line-left {
  border-left: 1px solid #e5e9f2;
}
.gray-font {
  color: #aaa;
  cursor: pointer;
}
.gray_set:hover {
  color: #333 !important;
}
.pay_info {
  display: block;
  margin: 0 auto;
  margin-top: 5px;
  padding-top: 5px;
  border-top: solid 1px #e5e5e5;
  line-height: 19px;
  overflow: hidden;

  width: 95px;
}
.pd_5 {
  padding-top: 0px;
  padding-left: 20px;
  padding-right: 20px;
}
.v_c {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}
.order_list .big_table {
  width: 100%;
}
.big_table_td {
  vertical-align: top;
  min-height: 100px;
  padding: 25px 15px 15px;
  border-right: 1px solid #e5e9f2;
  border-bottom: 1px solid #e5e9f2;
  font-size: 12px;
  color: #666;
  line-height: 20px;
}
.uname {
  cursor: pointer;
}
.uname:hover a {
  color: red !important;
}

.small_table {
  width: 100%;
  min-height: 100px;
  border: none;
}
.small_table tr {
  border-bottom: 1px #e5e9f2 solid;
  display: flex;
  align-items: center;
}
.small_table tr:last-child {
  border-bottom: none;
}

.small_table td {
  padding: 10px 10px 20px 10px;
  line-height: 20px;
  color: #333;
  font-size: 12px;
  flex: 1;
}

.li_1 {
  width: 40%;
  border-left: 1px solid #e5e9f2;
}
.li_2 {
  width: 15%;
}
.li_3 {
  width: 15%;
}
.li_4 {
  width: 15%;
}
.li_5 {
  width: 15%;
}
.order_details {
  color: #333;
  line-height: 22px;
}
.table_img {
  width: 100px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-content: center;
}
.table_img img {
  width: 100%;
}
.fixed-info {
  span {
    display: inline-block;
    width: 60px;
  }
}
.mail_box {
  width: 100%;
  height: 600px;
  overflow-y: scroll;
}
</style>
